<template>
	<view class="">

		<!-- 第一张广告图片 -->
		<view class="home-img1">
			<image class="home-img1-item" src="../../../static/home-img1.png" mode="scaleToFill"></image>
		</view>
		<!-- banner图 -->
		<view class="home-banner">
			<swiper class="swiper" circular indicator-dots="true" autoplay="true">
				<swiper-item>
					<view class="swiper-item uni-bg-red">
						<image class="swiper-item-img" src="https://img0.baidu.com/it/u=3217815253,3680239821&fm=26&fmt=auto&gp=0.jpg" mode="scaleToFill"></image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item uni-bg-green">
						<image class="swiper-item-img" src="https://img1.baidu.com/it/u=3168911549,107810081&fm=26&fmt=auto&gp=0.jpg" mode="scaleToFill"></image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item uni-bg-blue">
						<image class="swiper-item-img" src="https://img1.baidu.com/it/u=1973874518,262080299&fm=26&fmt=auto&gp=0.jpg" mode="scaleToFill"></image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item uni-bg-blue">
						<image class="swiper-item-img" src="https://img2.baidu.com/it/u=2979997962,1131942056&fm=26&fmt=auto&gp=0.jpg" mode="scaleToFill"></image>
					</view>
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			bannerImgs:{
				default:[],
				type:Array
			}
		},
		data(){
			return {
				
			}
		}
	}
</script>

<style>
	/* 第一张广告图片 */
	.home-img1 {
		width: 100%;
		height: 180px;
	}

	.home-img1-item {
		width: 100%;
		height: 100%;
	}

	/* banner图 */
	.home-banner {

		background-color: red;
		width: 97%;
		height: 120px;
		margin: 15px auto;
		border-radius: 10px;
	}

	.swiper {
		height: 100%;
	}

	.swiper-item {
		width: 100%;
		height: 100%;
	}

	.swiper-item-img {
		width: 100%;
		height: 100%;
		border-radius: 10px;
	}
</style>
